<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>账号安全</title>
    <link rel="stylesheet" type="text/css" href="../../css/reset.css">
    <link rel="stylesheet" type="text/css" href="../../css/main.css">
    <link rel="stylesheet" type="text/css" href="../../css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../../css/member.css">
    <script></script>
</head>
<body>
<link rel="stylesheet" href="/packages/resource/pintuer/pintuer.css">

<style>
    /*多分辨率设定rem设定*/
    html { font-size : 20px; }

    /*Note3*/
    @media only screen and (min-width: 360px) {
        html { font-size: 22px !important; }
    }

    /*iPhone6*/
    @media only screen and (min-width: 376px) {
        html { font-size: 23px !important; }
    }

    /*iPhone6 plus*/
    @media only screen and (min-width: 414px) {
        html { font-size: 25px !important; }
    }

    /*big Resolution*/
    @media only screen and (min-width: 641px) {
        html { font-size: 25px !important; }
    }

    body { font-family: Heiti, Heiti SC, DroidSans, DroidSansFallback, Arial, "Microsoft YaHei"; background-color: #f5f5f5; }

    h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal }



    #header {
        height: 50px;
        border-bottom: 1px solid #ddd;
    }
    .item {
        border-bottom: 1px solid #ddd;
        height: calc(100vh / 10);
        line-height: calc(100vh / 10);
        padding-left: 10px;

    }
    .nctouch-default-list-tit { font-size: 0.7rem; line-height: 1rem; padding: 0.5rem;}
    .nctouch-default-list { overflow: hidden; padding: 0 0 0 0.5rem; background-color: #FFF; border-top: solid 0.05rem #EEE; border-bottom: solid 0.05rem #EEE; }
    .nctouch-default-list li { position: relative; z-index: 1; display: block; clear: both; overflow: hidden; padding: 0.5rem 0; line-height: 1rem; border-top: solid 0.05rem #EEE; }
    .nctouch-default-list li:first-child { border-top: none; }
    .nctouch-default-list li a { display: block; overflow: hidden; font-size: 0.65rem; color: #000; }
    .nctouch-default-list li h4 { float: left; margin-left: 0.3rem; font-size: 0.7rem; line-height: 1rem; color: #333; }
    .nctouch-default-list li h4 i { display: inline-block; vertical-align: top; margin-right: 0.2rem; width: 0.9rem; height: 0.9rem; opacity: 0.5; background-position: 50% 50%; background-repeat: no-repeat; background-size: 80%; }
    .nctouch-default-list li h6 { float: left; clear: both; margin-left: 0.3rem; font-size: 0.55rem; line-height: 1rem; color: #888;}
    .nctouch-default-list li span.num { float: right; margin-right: 1.2rem; font-size: 0.6rem; line-height: 1rem;}
    .nctouch-default-list li span.tip { position: absolute; z-index: 1; top: 50%; right: 1.2rem; height: 0.9rem; margin-top: -0.4rem; font-size: 0.6rem; line-height: 0.9rem; color: #111;}
    .nctouch-default-list li span.arrow-r { position: absolute; z-index: 1; top: 50%; right: 0.5rem; display: block; width: 0.6rem; height: 0.6rem; margin-top: -0.3rem; background-image: url(../images/arrow_right_b.png); background-repeat: 50% 50%; background-repeat: no-repeat; background-size: 90%; opacity: 0.65; }
    .nctouch-default-list li span.pics {float: right; margin-right: 1.2rem; font-size: 0.6rem; line-height: 1rem;}
    .nctouch-default-list li span.pics img { width: 1rem; height: 1rem;}

    #bottom .nav .tab-line-item{
        font-size: .6rem;
    }

    .nctouch-main-layout{
        position: relative;
    }




    .nctouch-main-layout .page {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        width: 100%;
        height: calc(100vh - 100px);
        box-sizing: border-box;

    }

    @keyframes enter {
        from{
            left: 100%;
            opacity: 0;
        }
        to{
            left: 0;
            opacity:1;
        }
    }

    @keyframes out {
        from{
            left: 0;
            opacity: 1;
        }
        to{
            left: 100%;
            opacity:0;
        }
    }

    .enter{
        animation: enter 320ms;
    }
    .out{
        animation: out 320ms;
    }

    div.label{
        font-size: .7rem;
    }

    .nctouch-main-layout {
        height: calc(100vh - 100px);

    }
</style>
<script src="/data/resource/js/avalon.js"></script>

<header id="header"></header>
<div class=" nctouch-main-layout" ms-controller="safe">
    <ul id="list"  ms-if="type == 'list'" class="page nctouch-default-list">
        <li><a href="javascript:;" ms-click="change('pay_password')">
                <h4>支付密码</h4>
                <h6>建议您设置复杂的支付密码保护账户金额安全</h6>
                <span class="tip" id="paypwd_tips"></span> <span class="arrow-r"></span> </a></li>

    </ul>

    <div id="pay_password" class="pintuer page" ms-if="type == 'pay_password'" style="background: #fff;">
        <div class="padding">
            <div class="form-group margin-top">
                <div class="label">
                    原密码：
                </div>
                <div class="field">
                    <input type="password" class="input" name="pay_source_password">
                </div>
            </div>
            <div class="alert alert-red" style="font-size: .7rem;">
                新用户可以直接修改一次支付密码，此时原密码请留空
            </div>
            <div class="form-group margin-top">
                <div class="label">
                    新密码：
                </div>
                <div class="field">
                    <input type="password" class="input" name="pay_new_password">
                </div>
            </div>
            <div class="form-group margin-top">
                <div class="label">
                    确认密码：
                </div>
                <div class="field">
                    <input type="password" class="input" name="pay_confirm_password">
                </div>
            </div>

            <div class="margin-big-top ">
                <button style="width: 100%;font-size: .8rem;" class="button bg-blue pay_password_save" type="button" >保存</button>
            </div>


        </div>
    </div>
</div>

<script>
    var path = [];
    var ctrl = avalon.define({
        $id : 'safe',
        type : 'list',
        change : function(type) {
            path.push(ctrl.type);
            ctrl.type = type;
            $('.page').removeClass('enter');
            setTimeout(function() {
                $('#' + type).addClass('enter');
            })
        }
    });


</script>

<div id="footer"></div>

</body>
</html>
<script type="text/javascript" src="../../js/template.js"></script>

<script type="text/javascript" src="../../js/config.js"></script>
<script src="/data/resource/js/jquery.js"></script>
<!--<script src="/data/resource/layer/layer.js"></script>-->
<script src="/packages/resource/js/clayer.js"></script>
<script type="text/javascript" src="../../js/zepto.min.js"></script>
<script src="../../js/touch.js"></script>

<script type="text/javascript" src="../../js/common.js"></script>
<script type="text/javascript" src="../../js/tmpl/common-top.js"></script>
<script type="text/javascript" src="../../js/tmpl/footer.js"></script>

<script>
    $(document).on('click','header a',function(e) {
        $('.enter').addClass('out');
        setTimeout(function () {
            var top = path.pop();
            if(top == null) {
                location.href = '/wap/tmpl/member/member.php';
                return;
            }
            $('.out').removeClass('out');
            ctrl.type = top;
        }, 320);
        e.stopPropagation();
        e.preventDefault();
        return false;
    });


    $(document).on('click','.pay_password_save',function() {
        var source_password = $('[name=pay_source_password]').val();
        var new_password = $('[name=pay_new_password').val();
        var confirm_password = $('[name=pay_confirm_password]').val();
        if(new_password != confirm_password) {
            clay.msg("确认密码和密码填写不一致");
            return;
        }
        if(new_password.length < 7) {
            clay.msg("密码不能小于7位");
            return;
        }
        var index = clay.load();

        $.post('/shop/?act=seccode&op=reset_pay_password',{old_pass : source_password,new_pass : new_password},function(msg) {
            clay.close(index);

            if(msg == 'success'){
                clay.msg("修改成功",function () {
                    $('header a').click();
                });
            }
            else{
                clay.msg("修改失败，请检查填写");

            }

        });

    });
</script>
